<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>小米官网</title>
		<script src="http://cdn.bootcss.com/jquery/1.8.3/jquery.js"></script>
		<script src="js/script.js"></script>
		<link rel="stylesheet" type="text/css" href="css/style.css"/>
		
	</head>
	<body>
		<div class="top">
			<div id="top">
				<div class="top-left">					
						<a href="#">小米网</a><span>|</span>
						<a href="#">MIUI</a><span>|</span>
						<a href="#">米聊</a><span>|</span>
						<a href="#">游戏</a><span>|</span>
						<a href="#">多看阅读</a><span>|</span>
						<a href="#">云服务</a><span>|</span>
						<a href="#">小米网移动版</a><span>|</span>
						<a href="#">问题反馈</a><span>|</span>
						<a href="#">Select Region</a>
				</div>
				<div class="top-right">
					<b id="buybox"><i class="buybox">&#xe65a;</i>购物车(0)</b>
					<div class="denglu">
					<a href="#">登录</a><span>|</span><a href="#">注册</a>
					</div>
					<div class="zhuangtai">购物车中还没有商品，赶紧选购吧！</div>
				</div>
			</div>
		</div>
		<!--导航图-->
		<div class="nav">
			<h1><img src="img/mi-logo.png"/></h1>
			<div class="nav-left">
				<h2><img src="img/haidaoquannew.gif"/></h2>					
					<div class="nav1">
						<a href="javascript:;">小米手机</a>
						<a href="javascript:;">红米</a>
						<a href="javascript:;">平板</a>
						<a href="javascript:;">电视</a>
						<a href="javascript:;">影音·盒子</a>
						<a href="javascript:;">路由器</a>
						<a href="javascript:;">硬件智能</a>
					</div>
					<div class="nav2">
						<a href="javascript:;">服务</a>
						<a href="javascript:;">社区</a>
					</div>
			</div>
			<div class="nav-right">
				<form>
					<input class="txt" type="text" id="text" value=""/><button class="btn"><i class="buybox">&#xe699;</i></button>
				</form>
				<div class="icon"><a href="javascript:;">红米3s</a><a href="javascript:;">小米手环2</a></div>
				<div class="result">
					<ul class="box">
						<li><a href="javascript:;">小米手机5<span>约有11件</span></a></li>
						<li><a href="javascript:;">空气净化器2<span>约有1件</span></a></li>
						<li><a href="javascript:;">活塞耳机<span>约有4件</span></a></li>
						<li><a href="javascript:;">小米路由器<span>约有8件</span></a></li>
						<li><a href="javascript:;">移动电源<span>约有21件</span></a></li>
						<li><a href="javascript:;">运动相机<span>约有3件</span></a></li>
						<li><a href="javascript:;">小米体重秤<span>约有12件</span></a></li>
						<li><a href="javascript:;">配件优惠套装<span>约有32件</span></a></li>
					</ul>
				</div>
			</div>
		<div id="nav-menu-wrap">
		<div id="nav-menu">
			<ul>
				<li class="first">
					<a href="javascript:;"><img src="img/1.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/2.jpg" alt=""></a>
					<a href="javascript:;">小米手机5</a>
					<p>1499起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/3.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/4.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
			</ul>
			<ul>
				<li class="first">
					<a href="javascript:;"><img src="img/5.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/6.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/7.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
			</ul>
			<ul>
				<li class="first">
					<a href="javascript:;"><img src="img/8.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/9.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/10.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
			</ul>
			<ul>
				<li class="first">
					<a href="javascript:;"><img src="img/11.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/12.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/13.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/14.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/15.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/16.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
			</ul>
			<ul>
				<li class="first">
					<a href="javascript:;"><img src="img/17.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/18.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/19.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/20.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/21.png" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/22.png" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
			</ul>
			<ul>
				<li class="first">
					<a href="javascript:;"><img src="img/23.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/24.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/25.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/26.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/27.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
			</ul>
			<ul>
				<li class="first">
					<a href="javascript:;"><img src="img/28.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/29.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/30.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/31.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/32.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
				<li>
					<a href="javascript:;"><img src="img/33.jpg" alt=""></a>
					<a href="javascript:;">小米MAX</a>
					<p>4999起</p>
				</li>
			</ul>
		</div>
		</div>
	</div>
		<!--banner-->
		<!----------------------banner----------------------------->
		<div class="banner">
			<div class="before"></div>
			<div class="banner-left" >
				<ul>
					<li><span>手机</span><span>平板</span><span>电话卡</span><b>></b></li>
					<li><span>电视</span><span>盒子</span><b>></b></li>
					<li><span>路由器</span><span>智能硬件</span><b>></b></li>
					<li><span>移动电源</span><span>电源板</span><b>></b></li>
					<li><span>耳机</span><span>音箱电源  </span><b>></b></li>
					<li><span>电池</span><span>储存卡</span><b>></b></li>
					<li><span>保护盖</span><span>后壳</span><b>></b></li>
					<li><span>贴膜</span><span>其他配件</span><b>></b></li>
					<li><span>米兔</span><span>服装</span><b>></b></li>
					<li><span>箱包</span><span>其他周边</span><b>></b></li>
				</ul>				
			</div>
			<div class="wrap" id="wp" style="display:none;">
					<div class="list" style="display:none;">
						<ul>
							<li>
								<img src="sj1.jpg"/>
								<span>小米手机5</span>
								<input type="text" value="选购"/>
							</li>
							<li>
								<img src="sj1.jpg"/>
								<span>小米手机5</span>
								<input type="text" value="选购"/>
							</li>
							<li>
								<img src="sj1.jpg"/>
								<span>小米手机5</span>
								<input type="text" value="选购"/>
							</li>
							<li>
								<img src="sj1.jpg"/>
								<span>小米手机5</span>
								<input type="text" value="选购"/>
							</li>
							<li>
								<img src="sj1.jpg"/>
								<span>小米手机5</span>
								<input type="text" value="选购"/>
							</li>
							<li>
								<img src="sj1.jpg"/>
								<span>小米手机5</span>
								<input type="text" value="选购"/>
							</li>
							<li>
								<img src="sj1.jpg"/>
								<span>小米手机5</span>
								<input type="text" value="选购"/>
							</li>
							<li>
								<img src="sj1.jpg"/>
								<span>小米手机5</span>
								<input type="text" value="选购"/>
							</li>
							<li>
								<img src="sj1.jpg"/>
								<span>小米手机5</span>
								<input type="text" value="选购"/>
							</li>
							<li>
								<img src="sj1.jpg"/>
								<span>小米手机5</span>
								<input type="text" value="选购"/>
							</li>				
						</ul>
					</div>
						<div class="list" style="display:none">
							<ul>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
							</ul>
						</div>
						<div class="list" style="display:none">
							<ul>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
							</ul>
						</div>
						<div class="list" style="display:none">
							<ul>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
							</ul>
						</div>
						<div class="list" style="display:none">
							<ul>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
							</ul>
						</div>
						<div class="list" style="display:none">
							<ul>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
							</ul>
						</div>
						<div class="list" style="display:none">
							<ul>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
							</ul>
						</div>
						<div class="list" style="display:none">
							<ul>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
							</ul>
						</div>
						<div class="list" style="display:none">
							<ul>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
							</ul>
						</div>
						<div class="list" style="display:none">
							<ul>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
								<li><img src="sj1.jpg" alt=""><span>小米手机</span></img></li>
							</ul>
						</div>					
			</div>				
		<div class="banner-right">
				<div id="banner">
				<ul>
					<li class="active"><img src="img/41.jpg"></li>
					<li><img src="img/42.jpg"></li>
					<li><img src="img/43.jpg"></li>
					<li><img src="img/44.jpg"></li>
					<li><img src="img/45.jpg"></li>
				</ul>
			</div>
			<div id="btn">
				<ul>
					<li class="cur"></li>
					<li ></li>
					<li></li>
					<li></li>
					<li></li>
				</ul>
			</div>	
			<p><a href="javascript:;" id="pre"></a><a href="javascript:;" id="next"></a></p>
			</div>			
		</div>
	
	<div class="right-sidebar">
		<div class="myprero" id="prero">
			<div class="preo"></div>
			<div class="preotext">我的特权</div>
		</div>
		<div class="shopcar">
			<div class="iconcar"></div>
			<div class="cartext">购物车</div>
			
		</div>
		<div class="myassets"><img src="images/money.png"></div>
		<div class="brand"><img src="images/focus.png"></div>
		<div class="collect"><img src="images/shoucang.png"></div>
		<div class="footprint"><img src="images/visited.png"></div>
		<div class="recharge"><img src="images/7.png"></div>
		<div class="user-feedback"><img src="images/fankui.png"></div>
		<div class="code"><img src="images/9.png"></div>
		<div class="retop"><img src="images/10.png"></div>		
	</div>
	
	<div id="container" class="container-show">
		<div class="contain">
			<div class="container-left"><img src="images/tmlogo.jpg"/></div>
			<div class="container-right">
				<form action="" method="post">			
					<input type="text" id="search" class="searchbox"/><button id="btn2">搜 索</button>				
				</form>
				<div class="hotword"><a href="javascript:;">清新小短裤</a>秒变大长腿</div>
					<ul class="searchresult">
						<li><a href="javascript:;"><span></span></a></li>
					</ul>			
				</div>
		</div>
	</div>
	<div class="fp-list">		
		<div class="mui-lift-nav">导航</div>
		<div class="fpList">
			<a class="list1" href="javascript:;">亲子时光</a>
			<a class="list2" href="javascript:;">户外出行</a>
			<a class="list3" href="javascript:;">打造爱巢</a>
			<a class="list4" href="javascript:;">居家生活</a>
			<a class="list5" href="javascript:;">潮电酷玩</a>
			<a class="list6" href="javascript:;">美丽人生</a>
			<a class="list7" href="javascript:;">品牌旗舰</a>
			<a class="list8" href="javascript:;">猜你喜欢</a>
			<a class="list9" href="javascript:;">顶部</a>
		</div>
	</div>
	<div id="glass">
		<div id="smallpic">
	    	<span id="move"></span>	        
	        <img id="pic1" src="images/xiaomi50.jpg" style="width:200px;height:200px;"/>
	    </div>
	    	<ul class="piclist">
				<li ><a href="javascript:;"><img class="slide" src="images/xiaomi50.jpg" alt="" /></a></li>
				<li><a href="javascript:;"><img src="images/xiaomi51.jpg" alt="" /></a></li>
				<li><a href="javascript:;"><img src="images/xiaomi52.jpg" alt="" /></a></li>
				<li><a href="javascript:;"><img src="images/xiaomi53.jpg" alt="" /></a></li>
			</ul>		
	     <div id="bigpic">
			<img id="pic2" src="images/xiaomi50.jpg" />
		</div>
	</div>
	</body>
</html>
     